Inscribed polygon geometry

Define polygon side, perimeter and area functions:


In [1]:
from numpy import pi, sqrt, sin, cos

# http://www.efunda.com/math/areas/polygoninscribedgen.cfm
# Area of an equal sided polygon with given radius and number of sides
def polygon_area(r, n):
    return n*r**2/2*sin(2*pi/n)

# Perimeter of an equal sided polygon with given radius and number of sides
def polygon_perimeter(r, n):
    return 2*n*r*sin(pi/n)

# Side length of an equal sided polygon with given radius and number of sides
def polygon_side(r, n):
    return polygon_perimeter(r, n) / n

# http://stackoverflow.com/questions/23679130/polygon-area-perimeter-and-side-length-around-the-circle-with-python
# Area of an equal sided polygon with given radius and number of sides
def polygon_area_outer(r, n):
    return polygon_area(r, n) / cos(pi/n)**2

# Perimeter of an equal sided polygon with given radius and number of sides
def polygon_perimeter_outer(r, n):
    return polygon_perimeter(r, n) / cos(pi/n)

# Side length of an equal sided polygon with given radius and number of sides
def polygon_side_outer(r, n):
    return polygon_perimeter_outer(r, n) / n

Calculate properties of a circle:


In [2]:
#pi = 22/7.
sqrt2 = sqrt(2) #99/70.
sqrt3 = sqrt(3) #265/153.

radius = 50.4

diameter = 2*radius
perimeter = diameter*pi
area = radius**2*pi

print "With given radius we get:"
print
print "diameter:", diameter
print "perimeter:", perimeter
print "area:", area


With given radius we get:

diameter: 100.8
perimeter: 316.672539482
area: 7980.14799494

Import SVG helper and define basic svg draw function as well as circle drawing function for later repetitious use.


In [3]:
from tagtor import helper as h, svg
from IPython.display import HTML

color = "green"

def get_svg():
    # making sure original svg helper is used instead of accidental
    # overrided instance with a same name
    from tagtor import svg
    # http://www-archive.mozilla.org/projects/svg/faq.html
    s = svg(version=1.1, xmlns="http://www.w3.org/2000/svg").set_axes().set_grid()
    s.setAttribute("xmlns:xlink", "http://www.w3.org/1999/xlink")
    # set up a grid and size for the svg canvas
    # with 4 main parts having a grid of 7 smaller parts
    grid_aspects = (4,7)
    size = grid_aspects[0]*radius
    # drawing area (canvas) could be a rectangle with different width and height
    # but here we create a simple square like grid
    s.set_size(size, size)
    s.grid_aspects = grid_aspects
    return s

def set_center_circle(s, radius):
    s.set_circle(r=radius, fill=color, stroke=color, style="fill-opacity: 50%")

Draw a circle with a background grid:


In [4]:
s = get_svg()
s.origin = True
set_center_circle(s, radius)

# degrees
d = 144
x = cos(pi*d/180)*radius
y = sin(pi*d/180)*radius

s.set_circle(cx=x, cy=y, r=2, fill="black", stroke="black", style="fill-opacity: 50%")
s.set_text("(0,%s)" % radius, x=x-20, y=y+10, style="fill-opacity: 50%")
s.set_line(x1=0, y1=0, x2=x, y2=y, stroke="black", style="fill-opacity: 50%")

s


Out[4]:
(0,0)(0,50.4)

Five basic geometric figures

Let's construct five basic geometric figures relative to the given circle:

  • equilateral triangle
  • square
  • pentagon
  • hexagon
  • septagon

and calculate

  • side
  • perimeter
  • area

of each figure.

Geometric figure can be drawn inside and outside the circle. First we create inscribed polygons.

INNER


In [5]:
polygons = [["equilateral triangle", 3],
            ["square", 4],
            ["pentagon", 5],
            ["hexagon", 6]
           ]

for name, sides in polygons:
    perii = polygon_perimeter(radius, sides)
    print 
    print name, "side", perii / sides
    print name, "perimeter", perii
    print name, "area", polygon_area(radius, sides)


equilateral triangle side 87.2953607015
equilateral triangle perimeter 261.886082104
equilateral triangle area 3299.76463452

square side 71.2763635436
square perimeter 285.105454174
square area 5080.32

pentagon side 59.2487534311
pentagon perimeter 296.243767155
pentagon area 6039.58930108

hexagon side 50.4
hexagon perimeter 302.4
hexagon area 6599.52926903

In [6]:
# triangle
s1 = get_svg()
set_center_circle(s1, radius)
s1.set_triangle(radius=radius, degrees=90, 
                style="fill:brown; stroke:brown; fill-opacity: 50%")
# square
s2 = get_svg()
set_center_circle(s2, radius)
s2.set_square(radius=radius, degrees=0, 
              style="fill:blue; stroke:blue; fill-opacity: 50%")

# pentagon
s3 = get_svg()
set_center_circle(s3, radius)
s3.set_pentagon(radius=radius, degrees=90, 
                style="fill:yellow; stroke:yellow; fill-opacity: 50%")

# hexagon
s4 = get_svg()
set_center_circle(s4, radius)
s4.set_hexagon(radius=radius, degrees=90, 
               style="fill:purple; stroke:purple; fill-opacity: 50%")

s1+s2+s3+s4


Out[6]:

Next we create polygons outside the circle and printing of the properties and graphics under same iteration.

OUTER


In [7]:
polygons = [["equilateral triangle", 3, 90],
            ["square", 4, 0],
            ["pentagon", 5, 90],
            ["hexagon", 6, 90]
           ]

svghtml = ''

for name, sides, degrees in polygons:
    perii = polygon_perimeter_outer(radius, sides)
    print 
    print name, "side", perii / sides
    print name, "perimeter", perii
    print name, "area", polygon_area_outer(radius, sides)
    
    s = get_svg()
    s.set_polygon(radius=radius/cos(pi/sides), degrees=degrees, sides=sides,
                  style="fill:brown; stroke:brown; fill-opacity: 50%")
    set_center_circle(s, radius)
    svghtml += s

svghtml


equilateral triangle side 174.590721403
equilateral triangle perimeter 523.772164209
equilateral triangle area 13199.0585381

square side 100.8
square perimeter 403.2
square area 10160.64

pentagon side 73.2354868229
pentagon perimeter 366.177434115
pentagon area 9227.67133969

hexagon side 58.1969071343
hexagon perimeter 349.181442806
hexagon area 8799.37235871
Out[7]:

Star of David from Seed of Life geometry


In [8]:
# drawing canvas
def get_seed_of_life_svg():
    s = get_svg()
    s.set_size(s.size[0]*2, s.size[1]*2)
    s.axes = False
    s.grid = True
    return s

color = "green"

# basic seed of life geometry
def get_seed_of_life():
    s = get_seed_of_life_svg()
    s.set_circle(r=radius*sqrt3, fill=color, stroke=color, style="fill-opacity: 0%")
    s.set_circle(r=radius*2, fill=color, stroke=color, style="fill-opacity: 25%")
    for x, y in s.vertex(sides=6, radius=radius):
        s.set_circle(cx=x, cy=y, r=radius, fill=color, stroke=color, style="fill-opacity: 50%")
    return s

s1 = get_seed_of_life()
svghtml = str(s1)

# squares and 7/6 dimentions from seed of life geometry
#s1 = get_seed_of_life()
s1.set_square(radius=radius*2*sqrt2, degrees=45, 
              style="fill:"+color+"; stroke:white; fill-opacity: 15%")
s1.set_square(radius=radius*sqrt3*sqrt2, degrees=45, 
              style="fill:"+color+"; stroke:white; fill-opacity: 15%")

s1.set_line(x1=radius*2, y1=radius*2, x2=-radius*2, y2=radius*2, style="stroke:black;")
s1.set_text("7 (7.0000)", y=radius*2.5)
s1.set_circle(r=2, cx=radius*2, cy=radius*2, fill="black")
s1.set_circle(r=2, cx=-radius*2, cy=radius*2, fill="black")

s1.set_line(x1=radius*sqrt3, y1=radius*sqrt3, x2=-radius*sqrt3, y2=radius*sqrt3, style="stroke:black;")
s1.set_text("6 (3.5/√3 ~= 6.0622)", x=-radius, y=radius/2*sqrt3)
s1.set_circle(r=2, cx=radius*sqrt3, cy=radius*sqrt3, fill="black")
s1.set_circle(r=2, cx=-radius*sqrt3, cy=radius*sqrt3, fill="black")

svghtml += str(s1)

# seed of life geometry with intersection points
def set_vertex_points(s):
    for x, y in s1.vertex(sides=6, radius=radius*sqrt3, degrees=90):
        s.set_circle(cx=x, cy=y, r=2, fill="black")
    
    for x, y in s1.vertex(sides=6, radius=radius*2, degrees=90):
        s.set_circle(cx=x, cy=y, r=2, fill="black")

s1 = get_seed_of_life()
set_vertex_points(s1)
svghtml += str(s1)

# star of david from seed of life geometry
s1 = get_seed_of_life_svg()

s1.set_triangle(radius=radius*2, degrees=90, 
                style="fill:"+color+"; stroke:white; fill-opacity: 75%")
s1.set_triangle(radius=radius*2, degrees=270, 
                style="fill:"+color+"; stroke:white; fill-opacity: 75%")

s1.set_triangle(radius=radius*sqrt3, degrees=90, 
                style="fill:"+color+"; stroke:white; fill-opacity: 75%")
s1.set_triangle(radius=radius*sqrt3, degrees=270, 
                style="fill:"+color+"; stroke:white; fill-opacity: 75%")

s1.set_hexagon(radius=radius/2*sqrt3/cos(pi/6), degrees=0, 
               style="fill:"+color+"; stroke:white;")

set_vertex_points(s1)

svghtml += str(s1)

HTML(svghtml)


Out[8]:
7 (7.0000)6 (3.5/√3 ~= 6.0622)

In [9]:
s1 = get_seed_of_life_svg()

s1.set_defs(h.linearGradient(
                h.stop(**{'offset': "0%", 'stop-color': "#00cc00", 'stop-opacity': 1}),
                h.stop(**{'offset': "100%", 'stop-color': "#006600", 'stop-opacity': 1}),
                **{'spreadMethod': "pad", 'id': "gradient", 'gradientTransform': "rotate(25)",
                   'x1': "0%", 'y1': "0%", 'x2': "0%", 'y2': "100%"}))

s1.set_triangle(radius=radius*2, degrees=90, 
                style="fill:brown; stroke:white; fill-opacity: 75%")
s1.set_triangle(radius=radius*2, degrees=270, 
                style="fill:brown; stroke:white; fill-opacity: 75%")

s1.set_triangle(radius=radius*sqrt3, degrees=90, 
                style="fill:brown; stroke:white; fill-opacity: 75%")
s1.set_triangle(radius=radius*sqrt3, degrees=270, 
                style="fill:brown; stroke:white; fill-opacity: 75%")


s1.set_hexagon(radius=radius/2*sqrt3/cos(pi/6), degrees=0, 
               style="fill:url(#gradientt); stroke:white; fill-opacity: 40%")

s1


Out[9]:

The MIT License

Copyright (c) 2014 Marko Manninen